import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '@/store'
const PlayGround = () => import('@/views/playGround/')
const Layout = () => import('@/views/layout')
const Home = () => import('@/views/home/index.vue')
const Ask = () => import('@/views/ask/index.vue')
const Video = () => import('@/views/video/index.vue')
const Mine = () => import('@/views/mine/index.vue')
const MineEdit = () => import('@/views/mine/MineEdit.vue')
const Article = () => import('@/views/article/index.vue')
const Search = () => import('@/views/search/index.vue')
const Result = () => import('@/views/search/SearchResult.vue')
const Chat = () => import('@/views/chat/index.vue')
// import Login from '@/views/login/index.vue'
const Login = () => import('@/views/login/index.vue') // store===this.$store
// 路由懒加载   component:()=>import('@/views/login/index.vue')
Vue.use(VueRouter)

const routes = [
  {
    path: '/login',
    component: Login
  },
  {
    path: '/playground',
    component: PlayGround
  },
  {
    path: '/',
    component: Layout,
    redirect: '/home',
    children: [
      {
        path: 'home',
        // path:'/xxx'  当前路由的path就是/xxx
        // path:'aaa'   相对于自己父级拼接  父级/layout     /layout/aaa
        component: Home,
        meta: {
          keep: true
          // needLogin: true // 需要登录
        }
      },
      {
        path: 'ask',
        component: Ask,
        meta: {
          needLogin: true // 需要登录
        }
      },
      {
        path: 'video',
        component: Video,
        meta: {
          needLogin: true // 需要登录
        }
      },
      {
        path: 'mine',
        component: Mine,
        // 路由元信息：可以自行定义一些数据，后续 访问路由时可以拿到
        meta: {
          needLogin: true // 需要登录
        }
      }
    ]
  },
  {
    path: '/mineEdit',
    component: MineEdit,
    // 路由元信息：可以自行定义一些数据，后续 访问路由时可以拿到
    meta: {
      needLogin: true // 需要登录
    }
  },
  {
    path: '/article',
    component: Article,
    // 路由元信息：可以自行定义一些数据，后续 访问路由时可以拿到
    meta: {
      needLogin: true // 需要登录
    }
  },
  {
    path: '/search',
    name: 'Search',
    // redirect:重定向
    // alias: '/xxx'
    component: Search,
    // components: {
    //   default: Search
    // },
    meta: {}
  },
  {
    path: '/result/:key',
    name: 'Result',
    // redirect:重定向
    // alias: '/xxx'
    component: Result,
    // components: {
    //   default: Search
    // },
    meta: {}
  },
  {
    path: '/chat',
    name: 'Chat',
    // redirect:重定向
    // alias: '/xxx'
    component: Chat,
    // components: {
    //   default: Search
    // },
    meta: {
      needLogin: true // 需要登录
    }
  }
]

const router = new VueRouter({
  routes
})

// 前置守卫
router.beforeEach((to, from, next) => {
  // 需要登陆页面要登陆后才可访问，不需要登陆页面，随便访问
  /*
  如果要去的页面是否需要登录
       要登录后访问
            判断是否存在token
                存在：正常放行
                不存在：跳回登录页
       不要登录后访问
           直接放行
  */
  if (to.meta.needLogin === true) {
    if (store.state.user.tokenObj.token) {
      next()
    } else {
      next('/login?redirect=' + to.fullPath)
    }
  } else {
    next()
  }
})

const routerPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (location) {
  return routerPush.call(this, location).catch(error => error)
}

export default router
